<template>
    <div id="Statistical_Into">
        <el-breadcrumb separator="/">
            <el-breadcrumb-item>创作者小说列表</el-breadcrumb-item>
        </el-breadcrumb>
        <el-card class="box-card">
            <el-form ref="form" :model="searchForm" label-width="80px" :inline="true" size="small" class="admin_from">
                <el-form-item label="" :class="this.$store.state.windowWidth<=this.$store.state.MaxWidth?'maxWidth':''">
                    <el-input v-model="title" placeholder="请输入小说名称"></el-input>
                </el-form-item>
                <el-form-item label="" :class="this.$store.state.windowWidth<=this.$store.state.MaxWidth?'maxWidth':''">
                    <el-input v-model="author" placeholder="请输入作者名称"></el-input>
                </el-form-item>
                <el-form-item label="" :class="this.$store.state.windowWidth<=this.$store.state.MaxWidth?'maxWidth':''">
                    <el-select v-model="searchForm.issex" placeholder="请选择男频/女频" clearable
                               :class="this.$store.state.windowWidth<=this.$store.state.MaxWidth?'maxWidth':''">
                        <el-option label="男频" value="1"></el-option>
                        <el-option label="女频" value="2"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" size="small" @click="search">查询</el-button>
                </el-form-item>
            </el-form>
            <el-table
                    size="small"
                    :data="tableData"
                    border
                    style="width: 100%">
                <el-table-column
                        type="index"
                        label="#"
                        width="50">
                </el-table-column>
                <el-table-column
                        prop="coverpic"
                        label="封面"
                        width="122">
                    <template slot-scope="scope">
                        <img :src="scope.row.coverpic" width="30" height="30" alt="">
                    </template>
                </el-table-column>
                <el-table-column
                        prop="title"
                        label="书名">
                </el-table-column>
                <el-table-column
                        prop="author"
                        label="作者">
                </el-table-column>
                <el-table-column
                        prop="address"
                        label="男频/女频">
                    <template slot-scope="scope">
                        <span v-if="scope.row.issex==1">男频</span>
                        <span v-if="scope.row.issex==2">女频</span>
                    </template>
                </el-table-column>
                <el-table-column label="状态">
                    <template slot-scope="scope">
                        <span v-if="scope.row.review_status==0">审核中</span>
                        <span v-if="scope.row.review_status==1">审核通过</span>
                        <span v-if="scope.row.review_status==2">审核失败</span>
                    </template>
                </el-table-column>
                <el-table-column
                        prop="address"
                        label="操作"
                        width="230">
                    <template slot-scope="scope">
                        <el-button type="success" plain size="small" @click="pass(scope.row.id)"
                                   v-if="scope.row.review_status!==1">通过
                        </el-button>
                        <el-button type="danger" plain size="small" @click="refuse(scope.row.id)">拒绝</el-button>
                        <el-button type="primary" plain size="small" @click="edit(scope.row.id)">查看</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <div class="el-pagination">
                <el-pagination
                        background
                        @size-change="changeSize"
                        @current-change="changeCurrent"
                        :current-page="params.pagenum"
                        :page-sizes="[10, 20, 30, 40]"
                        :page-size="params.pagesize"
                        :total="params.totals"
                        :layout="this.$store.state.paginationLayout">
                </el-pagination>
            </div>
        </el-card>
        <!--            新增或编辑-->
        <el-dialog :title="formTitle" :width="this.$store.state.dialogMaxWidth" :visible.sync="visible">
            <novelDetail v-if="visible" @closeDatails="closeDatails" :bookId="bookId"></novelDetail>
        </el-dialog>
    </div>
</template>

<script>
  import novelDetail from '../../components/author/novel_list'

  export default {
    name: "Statistical_Into",
    components: {novelDetail},
    data() {
      return {
        params: {
          pagenum: 1,
          pagesize: 10,
          totals: 0,
        },
        tableData: [],
        fromTitle: '',
        visible: false,
        btype: 2,
        title: '',
        author: '',
        searchForm: {
          isrecommend: '',
          status: '',
          ishow: '',
          issex: '',
        },
        formTitle: '',
        bookId: '',
      }
    },
    created() {
      this.getList();
    },
    methods: {
      getList() {
        let data = {
          page: this.params.pagenum,
          page_size: this.params.pagesize,
          title: this.title,
          author: this.author,
          isrecommend: this.searchForm.isrecommend,
          status: this.searchForm.status,
          ishow: this.searchForm.ishow,
          issex: this.searchForm.issex,
          is_writer: 1,
        };
        this.$axios.post("admin/novel/index", data).then((res) => {
          console.log(res.data);
          this.params.totals = res.data.count;
          this.tableData = res.data.list;
        });
      },
      // 每页显示多少条
      changeSize(val) {
        this.params.pagesize = val;
        this.getList();
      },
      // 当前显示的页数
      changeCurrent(val) {
        this.params.pagenum = val;
        this.getList();
      },
      edit(id) {
        this.id = id;
        this.bookId = id;
        this.formTitle = '编辑';
        this.visible = true;
      },
      pass(id) {
        let status = 1;
        this.communal(id, status)
      },
      refuse(id) {
        let status = 2;
        this.communal(id, status)
      },
      communal(id, status) {
        this.$confirm('确定要进行操作, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.$axios.post('admin/writer/anime_review', {id: id, status: status}).then((res) => {
            this.$message.success('操作成功!');
            this.getList();
          });
        })
      },
      search() {
        this.params.pagenum = 1;
        this.getList();
      },
      closeDatails(data) {
        this.visible = data;
        this.getList();
      }
    }
  }
</script>

<style scoped>

</style>